<template>
  <div>
    <a-modal title="发薪申请" v-model="visible" width="560px" :footer="null" @cancel="$emit('update:visible', false)">
      <div class="content">
        <!-- <p><span style="color:red">*</span> 请选择要导出考勤数据的方式</p> -->
        <a-row class="item mb24" type="flex" justify="space-between" align="middle" @click.native="handleOk(1)">
          <a-col>
            <div class="point" style="background: #4686FF;"></div>
            直接从人员库选择
          </a-col>
          <a-col>
            <a-icon type="right" />
          </a-col>
        </a-row>
        <a-row class="item" type="flex" justify="space-between" align="middle" @click.native="handleOk(2)">
          <a-col
            ><div class="point" style="background: #32CCAA;"></div>
            我要自己上传发薪表</a-col
          >
          <a-col>
            <a-icon type="right" />
          </a-col>
        </a-row>
      </div>
    </a-modal>
  </div>
</template>

<script>
export default {
  props: {
    visible: {
      type: Boolean,
      default: false
    }
  },
  methods: {
    // 确定
    handleOk(v) {
      this.$emit("changeSW", v);
      this.$emit("update:visible", false);
    }
  }
};
</script>
<style lang="scss" scoped>
.content {
  overflow: auto;
  .item {
    height: 94px;
    padding: 24px;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    font-size: 16px;
    font-weight: 500;
    color: #3c3d43;
    .point {
      display: inline-block;
      width: 8px;
      height: 8px;
      border-radius: 50%;
      margin-right: 16px;
    }
  }
}
</style>
